<!doctype html>
<html>

<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
    <title>Data Bunker - app data</title>
    <script src="conf.js"></script>
    <script src="site.js"></script>
    <link rel="stylesheet" href="css/bootstrap.min.css">
    <link rel="stylesheet" href="style.css">

    <script src="js/jquery.min.js"></script>
    <script src="js/bootstrap.bundle.min.js"></script>
    <link href="https://cdnjs.cloudflare.com/ajax/libs/jsoneditor/7.0.4/jsoneditor.min.css" rel="stylesheet"
        type="text/css">
    <script src="https://cdnjs.cloudflare.com/ajax/libs/jsoneditor/7.0.4/jsoneditor.min.js"></script>
<script>
conf = loadUIConfiguration();
if (conf["custom_css_link"]) {
  document.write("<link rel='stylesheet' type='text/css' href='" + conf["custom_css_link"] +"' />");
}
</script>
</head>

<body>
    <div class="container">
        <div class="row col-md-12">
            <div style="width:100%;">
                <nav class="navbar navbar-expand-lg navbar-dark bg-primary">
                    <button class="navbar-toggler" type="button" data-toggle="collapse"
                        data-target="#navbarNavAltMarkup" aria-controls="navbarNavAltMarkup" aria-expanded="false"
                        aria-label="Toggle navigation">
                        <span class="navbar-toggler-icon"></span>
                    </button>
                    <div class="collapse navbar-collapse" id="navbarNavAltMarkup">
                        <ul class="navbar-nav">
				<script>showUserMenu();</script>
                        </ul>
                    </div>
                </nav>
            </div>
            <div class="bigblock">
                <h4>Application data</h4>
                <p id="msg"></p>
                <div id="data"></div>
            </div>
        </div>
	    <script>displayFooterLinks();</script>
    </div>
    <script>
        var xtoken = window.localStorage.getItem('xtoken');
        var token = window.localStorage.getItem('token');
        var ttype = window.localStorage.getItem('type');
        var editors = new Object();
        function fetchApp(token, xtoken, app) {
            var xhr0 = new XMLHttpRequest();
            // first save consent
            xhr0.open('GET', '/v1/userapp/token/' + token + "/" + app);
            xhr0.setRequestHeader("X-Bunker-Token", xtoken)
            xhr0.setRequestHeader('Content-type', 'application/json');
            xhr0.onload = function () {
                if (xhr0.status === 200) {
                    var data = JSON.parse(xhr0.responseText);
                    if (data.status == "ok") {
                        const displayApp = app.charAt(0).toUpperCase() + app.substring(1);
                        $('#data').append('<div class="row"><div class="col-9"><h5>App: ' + displayApp + '</h5></div>' +
                            '<div class="col-3 col-md3 "><button onclick="return saveApp(\'' + app + '\');" class="btn btn-secondary">Save</button></div></div>' +
                            '<div id="jsoneditor-' + app + '" style="width: 100%; min-height: 200px;"></div>');
                        const container = document.getElementById("jsoneditor-" + app)
                        const options = {
                            "mode": "form",
                            "statusBar": false,
                            "mainMenuBar": false,
                            "navigationBar": false,
                        }
                        const editor = new JSONEditor(container, options);
                        editor.set(data.data);
                        editors[app] = editor;
                    }
                } else if (xhr0.status > 400 && xhr0.status < 500) {
                    document.location = "/";
                }
            }
            xhr0.send();

        }
        function saveApp(app) {
            const updatedJson = editors[app].get();
            var params = JSON.stringify(updatedJson);
            var xhr0 = new XMLHttpRequest();
            // first save consent
            xhr0.open('PUT', "/v1/userapp/token/" + token+"/"+app);
            xhr0.setRequestHeader("X-Bunker-Token", xtoken)
            xhr0.setRequestHeader('Content-type', 'application/json');
            xhr0.onload = function () {
                if (xhr0.status === 200) {
                    var data = JSON.parse(xhr0.responseText);
                    if (data.status == "ok" && data.result && data.result == "request-created") {
                        showAlert("Admin request created to approve your app data changes.");
                    } else if (data.status == "ok" && data.result && data.result == "request-exists") {
                        showAlert("Similar request already exists for Admin approval.");
                    }
                } else if (xhr0.status > 400 && xhr0.status < 500) {
                    document.location = "/";
                }
            }
            xhr0.send(params);
            return false;
        }

        var xhr = new XMLHttpRequest();
        xhr.open('GET', '/v1/userapp/token/' + token);
        xhr.setRequestHeader("X-Bunker-Token", xtoken)
        xhr.setRequestHeader('Content-type', 'application/json');
        xhr.onload = function () {
            if (xhr.status === 200) {
                //$('#msg').text("Data loaded.");
                //console.log("apps", xhr.responseText);
                var data = JSON.parse(xhr.responseText);
                if (data.apps) {
                    var index;
                    for (index = 0; index < data.apps.length; ++index) {
                        var app = data.apps[index];
                        //console.log("app", app)
                        fetchApp(token, xtoken, app.trim());
                    }
                }
            } else if (xhr.status > 400 && xhr.status < 500) {
                document.location = "/";
            }
        }
        xhr.send()

    </script>
</body>
